<template>
  <view class="login" id="login">
    <view class="logo">
      <view class="logoImg"></view>
      <text>即时借还，共享拐杖</text>
    </view>
    
    <view class="loginBox">
        <view class="phone">
          <text class="title">手机号</text>
          <input class="inputIntem" v-model="userInfo.phone" type="number" placeholder="请输入手机号"/>
        </view>
        <view class="code">
          <text class="title">密码</text>
          <view class="codeCheck">
            <input class="inputIntem" type="password" v-model="userInfo.psd" placeholder="请输入密码"/>
          </view>
        </view>
        <view class="loginIn" @tap="loginIn"></view>
    </view>
  </view>
</template>

<script setup>
Taro.setNavigationBarColor({
    frontColor: '#000000',
    backgroundColor: '#C0EDED',
    animation: {
        duration: 400,
        timingFunc: 'easeIn'
    }
})
import './login.less'
import { ref, onBeforeMount} from 'vue'
import Taro from '@tarojs/taro'
import {getPublicKey, login} from '../../http/api'
import JSEncrypt from 'jsencrypt'
let token = Taro.getStorageSync('token')
let userInfo = ref({})
function loginIn () {
  console.log(userInfo.value)
  getPublicKey().then(res => {
      if(res.data) {
        let private_key_id = res.data.private_key_id
        let publicKey = res.data.public
        console.log(publicKey)
        let encryptor = new JSEncrypt()
        encryptor.setPublicKey(publicKey)
        let phone = typeof(userInfo.value.phone) == 'number' ? `${userInfo.value.phone}` : userInfo.value.phone
        console.log(phone, typeof(userInfo.value.phone))
        let username = encryptor.encrypt(phone)
        let password = encryptor.encrypt(userInfo.value.psd)
        login({private_key_id, username, password }).then(res => {
          Taro.setStorage({
            key: 'userInfo',
            data: JSON.stringify(res.data)
          })
          Taro.setStorage({
            key: 'token',
            data: res.data.token_key
          })
          Taro.navigateTo({
            url: '/pages/mine/mine'
          })
        })
      }
    })
  
}

</script>
